<template>
    <div id="qrcode">
        <!--二维码区域-->
        <div class="qrcode-box w">
            <div class="qr">
                <div class="wx">
                    <img src="./images/wx_code.png" alt="">
                    <p>微信公众号</p>
                </div>

                <div class="wb">
                    <img src="./images/wb_code.png" alt="">
                    <p>官方微博</p>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "qrcode"
    }
</script>

<style scoped lang="less">
    #qrcode{
        /* 二维码区域 */
        .qrcode-box {
            padding-top: 0.09rem;
            padding-bottom: 0.09rem;
            border-bottom: 0.05rem solid #eaeaea;

            .qr {
                width: 3.415rem;
                height: 1.375rem;
                background: url("./images/qrcode_back.png") no-repeat center center;
                background-size: contain;
                position: relative;

                div {
                    position: absolute;

                    img {
                        display: block;
                        width: 0.95rem;
                    }

                    p {
                        color: #fff;
                        font-size: 13px;
                        text-align: center;
                    }
                }

                .wx {
                    top: 0.155rem;
                    left: 1.3rem;
                }

                .wb {
                    top: 0.155rem;
                    right: 0.105rem;
                }
            }
        }

    }
</style>
